import Headroom from "headroom.js";
export default function useHeaderRoom(selector: HTMLElement, options?: any) {
	const defaultOptions = {
		offset: 30, // 在元素没有固定之前，垂直方向的偏移量（以 px 为单位）
		tolerance: { up: 0, down: 0 }, //  容忍度 scroll tolerance in px before state changes
		scroller: window,
		classes: {
			initial: "animated", // 当元素初始化后所设置的 class
			pinned: "slideUp", // 向上滚动时设置的 class
			unpinned: "slideDown", // 向下滚动时所设置的 class
			// when above offset
			top: "headroom--top",
			// when below offset
			notTop: "headroom--not-top",
			// when at bottom of scroll area
			bottom: "headroom--bottom",
			// when not at bottom of scroll area
			notBottom: "headroom--not-bottom",
			// when frozen method has been called
			frozen: "headroom--frozen"
			// multiple classes are also supported with a space-separated list
			// pinned: "headroom--pinned foo bar"
		},
		onPin: function () {
			// console.log("onPin", this);
		},
		onUnpin: function () {
			// console.log("onUnpin");
		},
		onTop: function () {
			// console.log("onTop");
		},
		onNotTop: function () {
			// console.log("onNotTop");
		},
		onBottom: function () {
			// console.log("onBottom");
		},
		onNotBottom: function () {
			// console.log("onNotBottom");
		},
		onUp: function () {
			// console.log("onUp");
		},
		onDown: function () {
			// console.log("onDown");
		}
	};
	new Headroom(selector, {
		...defaultOptions,
		...options
	}).init();
	return { selector };
}
